<template>
	<view class="login">
		<view class="login-box">
			<image src="../../static/uni.png" mode="" class="img"></image>
			<view class="title">
				家政员平台
			</view>
			<uni-forms :modelValue="loginForm" labelWidth="140rpx">
				<uni-forms-item label="手机">
					<input type="text" placeholder="请输入手机号码" v-model="loginForm.phone">
				</uni-forms-item>
				<uni-forms-item label="密码">
					<input type="text" placeholder="请输入你的密码" v-model="loginForm.password">
				</uni-forms-item>
				<uni-forms-item label="确认密码" v-if="flag">
					<input type="text" placeholder="请输入你的密码" v-model="loginForm.repassword">
				</uni-forms-item>
				<button v-if="!flag" @click="login">点击登录</button>
				<button v-if="flag"  @click="confirm">确认修改</button>
				<view class="tip" v-if="flag" @click="goBack">
					<text>本系统仅限于家政员登录</text>
					<text>返回用户端</text>
				</view>
			</uni-forms>
			<!-- <view class="row">
				<text class="label">手机：</text><input type="text" placeholder="请输入手机号码">
			</view>
			<view class="row" v-if="flag">
				<text class="label">密码：</text><input type="text" placeholder="请输入你的密码">
			</view>
			<view class="row" v-else>
				<text class="label">确认密码：</text><input type="text" placeholder="请再次输入密码">
			</view> -->
			<!-- <button v-if="flag" @click="login">点击登录</button>
			<button v-else @click="confirm">确认修改</button>
			<view class="tip" v-if="flag" @click="goBack">
				<text>本系统仅限于家政员登录</text>
				<text>返回用户端</text>
			</view> -->
		</view>
	</view>
</template>

<script>
	import { LoginHelper,EditPasswordHelper } from '../../api/index.js'
	export default {
		data() {
			return {
				flag:false,
				loginForm:{
					phone:'',
					password:'',
					repassword:''					
				}
			};
		},
		onLoad(options){
			if(options.pwd){
				this.flag = true
			}
		},
		methods:{
			async login(){
				const { data:res } = await LoginHelper(this.loginForm)
				console.log(res,'loginhelper')
				if(res.status==0){
					uni.setStorageSync('userinfohelper',JSON.stringify(res.user))
					uni.navigateTo({
						url:'/subPackageHH/my/my'
					})
					console.log(this.$store.commit,'comit')
					this.$store.commit('addTimes',1)
					this.$store.commit('updateTime')
				}
			},
			async confirm(){
				const {data:res} = await EditPasswordHelper(this.loginForm)
				console.log(res,'editpwd')
				
				if(res.status==0){
					uni.showModal({
						icon:'success',
						title:'修改密码成功'
					})
					this.loginForm={}
				}else{
					uni.showModal({
						icon:'error',
						title:res.message
					})
				}
			},
			goBack(){
				
			}
		}
	}
</script>

<style lang="scss">
.login{
	width: 100%;
	height: 100vh;
	background: #00CDCD;
	padding-top: 200rpx;
	.login-box{
		width: 70%;
		background: #fff;
		border-radius: 20rpx 50rpx 20rpx 50rpx;
		margin: auto;
		text-align: center;
		padding: 100rpx 20rpx 50rpx 20rpx;
		.img{
			width: 100rpx;
			height: 100rpx;
		}
		.title{
			font-weight: bold;
			margin: 30rpx;
		}
		.row{
			display: flex;
			align-items: center;
			border-bottom: 1px solid #eee;
			padding-bottom: 15rpx;
			justify-content: flex-start;
			line-height: 60rpx;
			.label{
				display: inline-block;
				width: 170rpx;
				text-align: center;
				// border: 1px solid #000;
			}
			input{
				text-align: left;
			}
		}
		.uni-forms{
			.uni-forms-item{
				padding: 0 40rpx;
				display: flex;
				.uni-forms-item__content{
					input{
						height: 72rpx;
						text-align: left;
					}
				}
			}
		}
		button{
			width: 60%;
			font-size: 30rpx;
			height: 60rpx;
			line-height: 60rpx;
			background: #00CDCD;
			color:#fff;
			margin-top: 30rpx;
		}
		.tip{
			padding-top: 30rpx;
			text{
				display: block;
				font-size: 28rpx;
				color: 	#00CDCD;
			}
		}
	}
}
</style>
